<!DOCTYPE HTML>
<html>
<head>
<title>Boomerang 使用方法 #1a: ページ上のリンクをユーザーがクリックし onload イベントが発生した時にページは有効になる</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="../../boomerang-docs.css">
</head>
<body>
<span style="float:right;"><a href="../">ドキュメント一覧</a> | <a href="index.html">使用方法一覧</a></span>
<h1>Boomerang 使用方法 #1a:<br>ページ上のリンクをユーザーがクリックし onload イベントが発生した時にページは有効になる</h1>
<p>
この要件の説明は <a href="../use-cases.html#uc-1">ユースケース #1</a> をご覧ください。
</p>
<p>
このユースケースのために2つのページを使います。あなたのサイト上の2つのページに同じコードを埋め込みます。最初から始める場合はこのようになります:
</p>
<ol>
<li>あなたのドキュメントルートに boomerang.js と images/ ディレクトリーをコピーします</li>
<li>次のコードをあなたの全てのページに追加します:</li>
</ol>
<pre>
&lt;script src="boomerang.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
BOOMR.init({
		user_ip: "&lt;user's ip address&gt;",
		beacon_url: "http://yoursite.com/path/to/beacon.php"
	});
&lt;/script&gt;
</pre>
<p>
これはあなたのサイトにきたユーザーが訪れた一番最初のページを除いて、ページの読み込み時間の測定には十分なものになります。PHP や Python、C# といったようなサーバーサイドの言語を使ってユーザーの IP アドレスを取得する必要があります。これはリクエスト間の帯域幅を計算した結果を保存するために必要になります。
</p>

<p>
ページの読み込みテストの結果を見るには <a href="howto-1a-page%232.html">ページ #2</a> へ移動してください。
</p>

<h2>より複雑なサイト</h2>
<p>
長い間ウェブサイトをやっていると JavaScript を CDN を使ってホスティングしたり、サブディレクトリーをもったページがあったりする場合があります。そういった場合は、<code>boomerang.js</code> へのリンクを絶対パスに変更します。帯域幅のテスト用の画像の場所も boomerang に設定する必要があります。<code>init()</code> をこのようにして呼び出します:
</p>
<pre>
BOOMR.init({
		user_ip: "&lt;user's ip address&gt;",
		beacon_url: "http://yoursite.com/path/to/beacon.php",
		BW: {
			base_url: 'http://yoursite.com/path/to/bandwidth/images/"
		}
	});
</pre>
<p>
注意、これは画像ディレクトリの場所を示します。あなたがユーザーの帯域幅や遅延を測定したいサーバー上に画像を配置することを推奨します。これはほとんど場合はあなたのサーバー上で行うことになるとは思いますが、もしかすると代わりにそれらのファイルを CDN に置いて帯域幅や遅延を測定したい場合もあるかもしれません。判断は任せますが、あなたのサーバー上に配置することをおすすめします。
</p>

<p>
ページの読み込みテストの結果を見るには <a href="howto-1a-page%232.html">ページ #2</a> へ移動してください。
</p>

<p class="perma-link">
最新のソースコードとドキュメントは <a href="http://github.com/lognormal/boomerang/">github.com/lognormal/boomerang</a> に公開されています。
</p>

<p id="results">
</p>

<script src="../../../boomerang.js" type="text/javascript"></script>
<script src="../../howtos/howtos.js" type="text/javascript"></script>
<script type="text/javascript">
BOOMR.init({
		user_ip: '10.0.0.1',
		BW: {
			base_url: '../../images/',
			cookie: 'HOWTO-BA'
		},
		RT: {
			cookie: 'HOWTO-RT'
		}
	});
</script>
</body>
</html>
<!--
    Copyright (c) 2011, Yahoo! Inc.  All rights reserved.
    Copyrights licensed under the BSD License. See the accompanying LICENSE.txt file for terms.
-->
